<template>
<div class="sa-wrap">
  <div class="sa-head displayflex">
    <div class="pic"><img src="~images/icon/peo.jpg"></div>
    <div class="msg flex1">
      <div class="name cf"><div class="f-l people">{{Tratvehicle.Driver1Name}} {{Tratvehicle.Driver1Tel}}</div><em class="f-l">配送员</em></div>
      <div class="time">{{Main.ArrivalDate | timeshort}}送达</div>
    </div>
  </div>
  <div class="sa-body">
    <div class="star"><rater v-model="starValue" active-color="#f6a355" :font-size="21"></rater></div>
    <div class="tip" v-if="starValue==1">非常不满意，各方面都很差</div>
    <div class="tip" v-if="starValue==2">不满意，比较差</div>
    <div class="tip" v-if="starValue==3">一般，需要改善</div>
    <div class="tip" v-if="starValue==4">比较满意，仍可改善</div>
    <div class="tip" v-if="starValue==5">非常满意，无可挑剔</div>
    <div class="check cf">
      <label class="remark-check f-l" v-for="item in remark">
        <input type="checkbox" class="ipt" name="remark" v-model="remarkValue" :value="item">
        <span class="txt">{{item.text}}</span>
      </label>
    </div>
    <div class="txt-wrap">
    <textarea class="textarea" v-model="Memo" maxlength="200" placeholder="其它想说的（将匿名并延迟告知配送员）"></textarea>
    </div>
  </div>
  <div class="sa-btn">
   <div class="fb-btn" @click="sbmitBtn()">提交</div>
  </div>
</div>
</template>

<script>
export default {
  data() {
    return {
      starValue: 1,
      remarkValue: [],
      remark: [
        {
          id: 1,
          text: "态度服务好"
        },
        {
          id: 2,
          text: "包装完美"
        },
        {
          id: 3,
          text: "到货神速"
        }
      ],
      Tratvehicle: [],
      Main: [],
      Bill: [],
      Memo: ""
    };
  },
  computed: {
    userinfo() {
      if (localStorage.UserInfo) {
        return JSON.parse(localStorage.UserInfo);
      }
    }
  },
  created() {
    this.getData();
  },
  methods: {
    getData() {
      var self = this;
      var guid = this.$route.query.id;
      var query = {
        Guid: guid
      };
      this.Ajax.post("GetOrderDetail", query).then(function(resp) {
        self.Tratvehicle = resp.Data.Tratvehicle;
        self.Main = resp.Data.Main;
        self.Bill = resp.Data.Bill;
      });
    },
    sbmitBtn() {
      var self = this;
      console.log(self.starValue);
      var query = {
        TenantGuid: self.userinfo.TenantGuid,
        CorpGuid: self.userinfo.CorpGuid,
        BBGuid: self.Bill.Guid,
        BBillNo: self.Bill.BBillNo,
        EvaluationGuid: self.userinfo.StaffID,
        EvaluationName: self.userinfo.Name,
        EvaluationScore: self.starValue,
        EvaluationDetails: JSON.stringify(self.remarkValue),
        EvaluationObjectGuid: self.Tratvehicle.Driver1Guid,
        EvaluationObjectName: self.Tratvehicle.Driver1Name,
        Memo: self.Memo,
        CreateUserID: self.userinfo.StaffID,
        CreateUserName: self.userinfo.Name
      };
      this.Ajax.post("Evaluation", query).then(function(resp) {
        if (resp.IsSuccess) {
          self.$vux.toast.show({
            type: "text", //success, warn, cancel, text
            text: "评价成功！"
          });
          self.$router.push({
            path: "/orderList"
          });
        } else {
          self.$vux.toast.show({
            type: "text", //success, warn, cancel, text
            text: resp.ErrorMessage
          });
        }
      });
    }
  }
};
</script>